/*
*编辑
*EditPrivateMan.js*/

import React, { PropTypes, PureComponent } from 'react';
import { autobind } from 'core-decorators';
import { Button, Modal, Form, Input,  } from 'antd';
import { connect } from 'react-redux';
import style from './editPrivateMan.less';

const FormItem = Form.Item;
const EditPrivateManForm = Form.create()(
	(props) => {
		const { visible, onCancel, onCreate, form,data } = props;
		console.log('sssssssssss',data)
		const { getFieldDecorator } = form;

		const formItemLayout = {
      labelCol: {
        xs: { span: 24 },
        sm: { span: 8 },
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 14 },
      },
    };

		return (
			visible ?
				<Modal
					className={`${style.EditPrivate} add-EditPrivate`}
					visible={visible}
					title="编辑"
					okText="提交"
					cancelText="取消"
					onCancel={onCancel}
					onOk={onCreate}
				>
					<Form layout="vertical" className={style.EditPrivate}>
						{/*<FormItem label="社会信用编码">*/}
						<FormItem label="社会信用编码" {...formItemLayout}>
              {getFieldDecorator('creditCode', {
                rules: [{ required: true, message: '请输入社会信用编码' }],
                initialValue: data.creditCode,
              })(
                <Input />
              )}
            </FormItem>
						{/*<FormItem label="私募名称">*/}
						<FormItem label="私募名称" {...formItemLayout}>
              {getFieldDecorator('name', {
                rules: [{ required: true, message: '请输入私募名称' }],
                initialValue: data.name,
              })(
                <Input />
              )}
            </FormItem>
            {/*<FormItem label="联系人姓名">*/}
						<FormItem label="联系人姓名" {...formItemLayout}>
              {getFieldDecorator('contactName', {
                rules: [{ required: true, message: '请输入联系人姓名' }],
                initialValue: data.contactName,
              })(
                <Input />
              )}
            </FormItem>
            {/*<FormItem label="管理人编码">
              {getFieldDecorator('code', {
                rules: [{ required: true, message: '请输入管理人编码' }],
                initialValue: data.code,
              })(
                <Input />
              )}
            </FormItem>*/}
            {/*<FormItem label="手机">*/}
						<FormItem label="手机" {...formItemLayout}>
              {getFieldDecorator('mobile', {
                rules: [
								{ whitespace: true, pattern: /^((0\d{2,3}-\d{7,8})|(1[23456789]\d{9}))$/, message: '格式错误!' },
								{ required: true, whitespace: true, message: '请输入联系方式!' },
							],
							initialValue: data.mobile,
              })(
                <Input />
              )}
            </FormItem>
            {/*<FormItem label="座机">*/}
						<FormItem label="座机" {...formItemLayout}>
              {getFieldDecorator('telephone', {
                rules: [
								{ whitespace: true, pattern: /^((0\d{2,3}-\d{7,8})|(1[23456789]\d{9}))$/, message: '格式错误!' },
								{ required: true, whitespace: true, message: '请输入联系方式!' },
							],
							initialValue: data.telephone,
              })(
                <Input />
              )}
            </FormItem>
            {/*<FormItem label="邮箱">*/}
						<FormItem label="邮箱" {...formItemLayout}>
              {getFieldDecorator('email', {
                rules: [
								{ whitespace: true, pattern: /^(\w)+(\.\w+)*@(\w)+((\.\w{2,3}){1,3})$/, message: '请输入正确邮箱地址!' },
								{ required: true, whitespace: true, message: '请输入邮箱地址!' },
							],
							initialValue: data.email,
              })(
                <Input />
              )}
            </FormItem>
						{/*<FormItem label="微信">*/}
						<FormItem label="微信" {...formItemLayout}>
              {getFieldDecorator('wechat', {
                rules: [{ required: true, message: '请输入微信' }],
                initialValue: data.wechat,
              })(
                <Input />
              )}
            </FormItem>
					</Form>
				</Modal> : null
		);
	},
);
const mapStateToProps = state => ({

});
const mapDispatchToProps = {
	editPdtManager: query => ({
		type: 'privateMger/editPdtManager',
		payload: query || {},
	}),
	
};

@connect(mapStateToProps, mapDispatchToProps)
class EditPrivateMan extends PureComponent {
	static propTypes = {
		form: PropTypes.object.isRequired,
	}
	constructor(props) {
		super(props);
		this.state = {
			visible: false,
			modalHeight: 0,
		};
	}
	componentDidUpdate() {
		const screenHeight = Math.max(document.documentElement.offsetHeight, document.body.offsetHeight);
		const ele = document.querySelector('.add-EditPrivate .ant-modal-body');
		if (ele) {
			ele.style.height = `${screenHeight * 0.7}px`;
		}
	}

	showModal = () => {
		this.setState({ visible: true });
	}

	handleCancel = () => {
		this.setState({ visible: false });
	}

	handleCreate = () => {
		const form = this.form;
		const { editPdtManager,data } = this.props;
		form.validateFields((err, values) => {
			if (err) {
				return;
			}
			const obj ={}
			console.log('Received values of form:>>>',data, values);
			for(let i in data) {
     		for(let k in values){
     			if(i == k&&data[i] !== values[k]){
     				obj[k]=values[k];
     			}
     				
     		}
			}
			console.log('Received',obj)
			editPdtManager({
				...obj,
				id:data.id
			})
			form.resetFields();
			this.setState({ visible: false });
			
		});
	}

	saveFormRef = (form) => {
		this.form = form;
	}

	render() {
		return (
			<div >
				<a onClick={this.showModal}>编辑</a>
				<EditPrivateManForm
					ref={this.saveFormRef}
					visible={this.state.visible}
					onCancel={this.handleCancel}
					onCreate={this.handleCreate}
					data={this.props.data}
				/>
			</div>
		);
	}
}
export default Form.create({
})(EditPrivateMan);